import * as React from "react";
import { NavigationContainer } from "@react-navigation/native";
import { createNativeStackNavigator } from "@react-navigation/native-stack";
import { createBottomTabNavigator } from "@react-navigation/bottom-tabs";
import { ParamList } from "./src/types/NavigationTypes";

import HomeScreen from "./src/screens/Home";
import ProfileScreen from "./src/screens/Profile";
import MessagesScreen from "./src/screens/Message";
import SettingsScreen from "./src/screens/Settings";
import WebViewScreen from "./src/screens/WebView";
import VideoScreen from "./src/screens/Video";
import LoginScreen from "./src/screens/Login";
import MineScreen from "./src/screens/Mine";
import { LogBox, Platform } from "react-native";
import SearchScreen from "./src/screens/Search";
import userManager from "./src/common/userManager";
import CartoonScreen from "./src/screens/Cartoon";
import { MyToast } from "./src/components/MyToast";

LogBox.ignoreAllLogs(); 

const Tab = createBottomTabNavigator<ParamList>();
const Stack = createNativeStackNavigator<ParamList>();

function HomeTabs() {
  return (
    <Tab.Navigator
      screenOptions={({ route }) => ({
        tabBarLabelPosition: "beside-icon",
        tabBarLabelStyle: {
          fontWeight: "700",
          fontSize: 17,
        },
        tabBarStyle: Platform.select({
          android: {
            height: 60,  
            paddingBottom: 15,
            paddingTop: 5,
          },
          default: {},
        }),
        tabBarActiveTintColor: "#3BC859",    
        tabBarInactiveTintColor: "rgba(0,0,0,0.6)", 
        tabBarIconStyle: { display: "none" },
        headerShadowVisible: false,
        //headerStyle: { elevation: 0 },
      })}
    >
      <Tab.Screen
        name="Home"
        component={HomeScreen}
        options={{ title: "首页" }}
      />
      <Tab.Screen
        name="Cartoon"
        component={CartoonScreen}
        options={{ title: "角色" }}
      />
      <Tab.Screen
        name="Messages"
        component={MessagesScreen}
        options={{ title: "消息" }}
      />
      <Tab.Screen
        name="Mine"
        component={MineScreen}
        options={{ title: "我的" }}
      />
    </Tab.Navigator>
  );
}

function App() {

  React.useEffect(() => {
    userManager.getUserInfo();
  }, []);

  return (
    <>
      <NavigationContainer>
      <Stack.Navigator screenOptions={{ headerShadowVisible: false }}>
        <Stack.Screen
          name="HomeTabs"
          options={{ headerShown: false, title: "" }}
          component={HomeTabs}
        />
        <Stack.Screen name="Profile" component={ProfileScreen} />
        <Stack.Screen name="Settings" component={SettingsScreen} />
        <Stack.Screen name="Web" component={WebViewScreen} />
        <Stack.Screen name="Search" component={SearchScreen} />
        <Stack.Screen
          name="Video"
          component={VideoScreen}
          options={{ headerShown: false }}
        />
        <Stack.Screen
          name="Login"
          component={LoginScreen}
          options={{ headerShown: false }}
        />
      </Stack.Navigator>
    </NavigationContainer>
    <MyToast/>
    </>
  );
}

export default App;
